// Learn TypeScript:
//  - https://docs.cocos.com/creator/manual/en/scripting/typescript.html
// Learn Attribute:
//  - https://docs.cocos.com/creator/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:
//  - https://docs.cocos.com/creator/manual/en/scripting/life-cycle-callbacks.html

const { ccclass, property } = cc._decorator;

@ccclass
export default class NewClass extends cc.Component {

    @property(cc.Sprite)
    icon: cc.Sprite = null;

    @property(sp.Skeleton)
    spine: sp.Skeleton = null;

    @property([cc.Slider])
    RGBSliders: cc.Slider[] = [];

    start() {

    }

    onSliderEvent(slider: cc.Slider) {
        let label = slider.node.getChildByName("value").getComponent(cc.Label);
        label.string = `${Math.round(slider.progress * 255)}`;
    }

    onClickChange() {
        this.updateMaterial(true);
    }
    private _brightColor: cc.Vec4 = new cc.Vec4();
    updateMaterial(enable: boolean) {
        let spriteMaterial = this.icon.getMaterial(0);
        let spineMaterial = this.spine.getMaterial(0);

        if (enable) {
            this._downtime = 0.1;
            cc.Vec4.set(this._brightColor, this.RGBSliders[0].progress, this.RGBSliders[1].progress, this.RGBSliders[2].progress, 0);
        } else {
            cc.Vec4.set(this._brightColor, 0, 0, 0, 0);
        }
        spriteMaterial.setProperty("brightColor", this._brightColor);
        spineMaterial.setProperty("brightColor", this._brightColor);
        if (CC_NATIVERENDERER)
            //@ts-ignore
            this.spine._updateMaterial();
    }
    private _downtime: number = 0;
    update(dt) {
        if (this._downtime > 0) {
            this._downtime -= dt;
            if (this._downtime <= 0) {
                this.updateMaterial(false);
            }
        }
    }
}
